<template>
  <div>
    <div class="contract_base_title">评估设置</div>
    <div class="area">
      <div class="title">
        <!-- <span class="asterisk">*</span> -->
        <span>评估模版</span>
      </div>
      <span @click="handleClick()" style="color: rgb(52, 135, 226); cursor: pointer">{{ templateData.tmpl.name }}</span>
      <!-- <span style="float: right">模版总分 100</span> -->
    </div>
    <MergeTable
      v-if="false"
      ref="mergeTableData"
      style="margin-bottom: 10px"
      :tableData="templateData.tableData"
      :checkbox="false"
      :mergeFields="mergeFields"
      :column="selectVendorList"
      :actionBtnIsShow="false"
    >
    </MergeTable>
    <div v-if="['PERFORMANCE'].includes(props.accessType)">
      <div class="area">
        <div class="title">
          <!-- <span  class="asterisk">*</span> -->
          <span>是否涉及评级</span>
        </div>
        <span>{{ templateData.gradeRatingFlag ? '是' : '否' }}</span>
      </div>
      <div class="area" v-if="templateData.gradeRatingFlag">
        <div class="title">
          <!-- <span  class="asterisk">*</span> -->
          <span>自动评级</span>
        </div>
        <span>{{ templateData.automaticRatingFlag ? '是' : '否' }}</span>
      </div>
      <row-tableV1
        v-if="templateData.automaticRatingFlag"
        :isPreview="false"
        :showIndex="true"
        :column="selectRateRule"
        :tableData="templateData.rateRuleData"
        :showActionBtn="false"
        :checkbox="false"
        :tableActionWidth="'100px'"
        :pageConfig="''"
      >
      </row-tableV1>
    </div>

    <!-- 考察/准入 -->
    <div class="area" v-if="['INSPECT', 'ACCESS'].includes(props.accessType)">
      <div class="title">
        <!-- <span v-if="!props.isPreview" class="asterisk">*</span> -->
        <span>{{ props.accessType == 'INSPECT' ? t('keys.Investigate_the_result_score_configuration'): t('keys.Access_result_score_configuration') }}</span>
      </div>
    </div>
    <MergeTable
      v-if="['INSPECT', 'ACCESS'].includes(props.accessType)"
      :isPreview="false"
      :showIndex="false"
      :column="props.accessType == 'INSPECT'? inspectColumnList :accessColumnList"
      :tableData="templateData.resultList"
      :showActionBtn="false"
      :mergeFields="[]"
      :actionBtnIsShow="false"
    >
    </MergeTable>
    <supplier-kpi-dialog ref="supplierKpiRef"></supplier-kpi-dialog>
  </div>
</template>
<script setup>
import { ref, defineProps, watch, nextTick } from 'vue'
import MergeTable from '@/components/MergeTable.vue'
import { useMock } from '../hooks/mock.js'
import { ElMessage } from 'element-plus'
import { useI18n } from 'vue-i18n'
import { ERR_OK } from '@/config/statusCode'
import { useRoute } from 'vue-router'
import supplierKpiDialog from './supplierKpiDialog.vue'
const $route = useRoute()
const { selectVendorList, selectRateRule, inspectColumnList, accessColumnList } = useMock()
const $emit = defineEmits(['update:modelValue'])
const { t } = useI18n()
const props = defineProps({
  isPreview: {
    type: Boolean,
    default: false
  },

  modelValue: {
    type: Object,
    default: () => {}
  },
  accessType: {
    type: String,
    default: ''
  }
})
let mergeFields = ['quotaTypeId']
let kpiGradeRuleId

const mergeTableData = ref()
const supplierKpiRef = ref()
const templateData = ref({
  ...props.modelValue,
  tableData: ref(props.modelValue?.sourceLineDetailList || []),
  rateRuleData: ref(props.modelValue?.gradeRuleContentList || []),
  resultList: ref(props.modelValue?.tmpl?.resultVoList || [])
})

console.log(templateData)
templateData.value.rateRuleData.forEach((v) => {
  v.numberStart = String(v.numberStart)
})
templateData.value.resultList.forEach((v) => {
  v.numberStart = String(v.numberStart)
})

const handleClick = () => {
  supplierKpiRef.value.showDialog(templateData.value.tmpl?.id)
}


defineExpose({})
</script>
<style lang="scss" scoped>
.area {
  margin-bottom: 14px;
  .asterisk {
    color: red;
  }
  .title {
    display: inline-block;
    // width: 80px;
    text-align: right;
    margin-right: 14px;
  }
}
</style>
